$(document).ready(function(){

    var username = tool.getCookie('username');
    if(username){
        $('#nav .top-nav .top-nav-userinfo').empty();
        var str = `
        <a>欢迎您${username}!</a>
        <span>|</span>
        <a class='sign-out'>退出</a>
        <span>|</span>
        <a href="JavaScript:;">消息通知</a>
        `;
        $('#nav .top-nav .top-nav-userinfo').html(str);
    }

    $('#nav .top-nav .top-nav-userinfo>a.sign-out').click(function(){
        var conindex = layer.confirm('你确定要退出吗？',{
            btn:['确定','取消']
        },function(){
            tool.removeCookie('username');
            console.log(222);
            $('#nav .top-nav .top-nav-userinfo').empty();
            var str = `
            <a href="./login.html">登录</a>
            <span>|</span>
            <a href="./register.html">注册</a>
            <span>|</span>
            <a href="JavaScript:;">消息通知</a>
            `;
            $('#nav .top-nav .top-nav-userinfo').html(str);
            layer.close(conindex)
        },function(){
            layer.msg('又留下来了',{
                icon:1,
                time:1000
            });
        });
        
    });
    
    $(window).scroll(function(){
        if($(window).scrollTop() >= 1000){
            $('#app .home-tool-bar ul .scroll-top').addClass('active');
            
            $('#app .home-tool-bar ul .scroll-top>a').click(function(){
                $(window).scrollTop() = 0;
                return false;
            });

        }else if($(window).scrollTop() < 1000){
            $('#app .home-tool-bar ul .scroll-top').removeClass('active');
        }
    });

    var loadindex = layer.load('0',{
            shade:[1,"#000"]
    });

    

    for(var i=0; i<$('#carousel').children('li').length; i++){
        var olList = $('<li></li>');
        olList.html("<a href='javascript:;'></a>")
        if(i===0){
            olList.find('a').addClass('active')
        }
        $('#carousel ol').append(olList[0])
    }

    var index = $('#carousel>li').index();
    var timerId = null;
    $('#carousel>.btn>a.right').click(function(){
        index++;
        Carousel();
    });
    $('#carousel>.btn>a.left').click(function(){
        index--;
        Carousel();
    });
    timerId = setInterval(()=>{
        index++;
        Carousel();
    },3000);

    $('#carousel').hover(function(){
        clearInterval(timerId);
    },function(){
        clearInterval(timerId);
        timerId = setInterval(()=>{
            index++;
            Carousel();
        },3000)
    });
    $('#carousel>ol>li').click(function(){
        index = $(this).index()
        Carousel();
    });

    $('#home-main .home-box .box-hd .more>ul>li').hover(function(){
        $(this).addClass('tab-active').siblings().removeClass('tab-active');
    });

    $.ajax({
        type: "post",
        url: "./php/category.php",
        dataType: "json",
    }).then(res=>{
        var {data} = res;
        var firstCat = data.filter(item=>item.pid==0)
        firstCat = firstCat.splice(0,10);
        handlerData(data,firstCat)
        var html = render(firstCat)
        document.querySelector(".nav-list .left>ul").innerHTML = html;

        return $.ajax({
            url:"php/goods.php",
            data:{pid:1212},
            dataType:"json",
        });
    }).then(res=>{
        var {data} = res;
        data = data.splice(0,3);
        str = '';
        data.forEach(item=>{
            str += `
                <li>
                    <a href="detail.html?id=${item.id}">
                        <img src="${item.img}" alt="${item.name}">
                    </a>
                </li>        
            `
        });
        $('.home-hero-sub .ul-list-img>ul').html(str);
        layer.close(loadindex);
    });

    function Carousel(){
    
        if(index >= $('#carousel').children('li').length){
            index = 0;
        }
        if(index <= -1){
            index = $('#carousel').children('li').length-1;
        }
        $('#carousel').children('li').eq(index).addClass('active').siblings().removeClass('active');
        $('#carousel>ol>li').eq(index).find('a').addClass('active').parent().siblings().find('a').removeClass('active');
    }
    
    function render(firstCat){
        var str = '';
        for(var i=0;i<firstCat.length;i++){
            str += '<li><a href="list.html?cat='+firstCat[i].id+'">'+firstCat[i].name+'</a>'
            if(firstCat[i].children){
                str += '<ul>'
                str += render(firstCat[i].children)
                str += '</ul>'
            }
            str += '</li>'
        }
        return str;
    }

    function handlerData(data,firstCat){
        for(var i=0;i<firstCat.length;i++){
            var cat = data.filter(item=>item.pid == firstCat[i].id)
            cat = cat.splice(0,5)
            if(cat.length){
                firstCat[i].children = cat
                handlerData(data,firstCat[i].children)
            }
        }
    }
});


